<!-- 邀请码 -->
<template>
	<view class="">
		<view class="hdtybox" :class="hdc">
			<topboxVue :tit="$t('hd.bt5')"></topboxVue>
			<view class="yhjbox">
				<image src="/static/tmp.png" class="yhjbox-toppic mb30" mode="widthFix"></image>
				<view class="yhjbox-box" style="margin-bottom: 60rpx;padding-bottom: 44rpx;">
					<view class="yhjbox-box-tit">
						{{$t('yhj.tit1')}}
					</view>
					<view class="yhjbox-box-inpbox mb30 bj_center">
						<input type="text" v-model="inp" maxlength="50" :placeholder="$t('yhj.inp')" />
					</view>
					<view class="f24 ca2 mb30">
						{{$t('yhj.txt1')}}
					</view>
					<view class="yhjbox-box-btn bj_center" @click="getm">
						{{$t('yhj.btn1')}}
					</view>
				</view>

				<view class="yhjbox-box" style="margin-bottom: 50rpx;padding-bottom: 34rpx;">
					<view class="yhjbox-box-tit2 bj_between">
						<image src="/static/hd/ico2.png"></image>
						<view class="">
							{{$t('yhj.tit2')}}
						</view>
					</view>
					<view class="yhjbox-box-btn bj_center" @click="tokf">
						<image src="/static/hd/ico3.png" mode="widthFix"></image>
						<text>{{$t('yhj.btn2')}}</text>
					</view>
				</view>

				<view class="f30 fwb mb20">
					{{$t('yhj.tit3')}}
				</view>
				<view class="f22 c9c" v-html="txt2"></view>
			</view>
			<bottomVue></bottomVue>

			<zero-loading type="surround" v-if="loading"></zero-loading>
		</view>

		<uni-popup ref="message" type="message">
			<uni-popup-message :type="msgType" :message="messageText" :duration="2000"></uni-popup-message>
		</uni-popup>
		<moneygcVue ref="mgcv"></moneygcVue>
	</view>

</template>

<script setup>
	import {
		ref,
		inject,
		provide
	} from 'vue';
	import topboxVue from '../common/topbox.vue';
	import useI18n from '@/store/useI18n.js'
	import bottomVue from "../common/bottom-slotsbr.vue";
	import common from '../../js/common';
	import moneygcVue from '../common/moneygc.vue';

	const {
		t
	} = useI18n()
	provide("repage", repage);
	let txt2 = t('yhj.txt2')
	// 父级关闭活动的方法
	const clhd = inject("clhd");
	let hdc = ref("hdpagein")
	let inp = ref("")

	let messageText = ref("")
	let message = ref(null)
	let msgType = ref("")
	let loading = ref(false)
	let mgcv = ref(null)

	function repage() {
		hdc.value = "hdpageout";
		clhd();
	}

	function getm() {
		if (loading.value) {
			return
		}
		loading.value = true
		common.getGift({
			code: inp.value
		}).then(res => {
			if (res.data.success) {
				mgcv.value.setm(res.data.data.bonus)
			} else {
				messageText.value = res.data.message
				msgType.value = "error"
				message.value.open();
			}
			loading.value = false
		})
	}

	function tokf() {
		window.open(getApp().globalData.config2.groupurl)
	}
</script>

<style scoped lang="scss">
	.yhjbox {
		padding: 30rpx 20rpx;

		&-toppic {
			width: 710rpx;
		}

		&-box {
			background: #00561D;
			border-radius: 20rpx;
			padding: 0 20rpx;

			&-inpbox {
				height: 88rpx;
				background: #00561D;
				border-radius: 12rpx;
				border: 2rpx solid #BFD2C6;
				padding: 0 22rpx;

				input {
					width: 100%;
					font-size: 30rpx;
				}
			}

			&-tit {
				padding-top: 28rpx;
				font-size: 26rpx;
				font-weight: bold;
				padding-bottom: 28rpx;
			}

			&-tit2 {
				padding-top: 44rpx;
				font-size: 26rpx;
				font-weight: bold;
				margin-bottom: 36rpx;

				image {
					width: 72rpx;
					height: 72rpx;
					margin-right: 20rpx;
				}
			}

			&-btn {
				height: 88rpx;
				background: linear-gradient( 180deg, #00802B 0%, #06C045 100%);
				border-radius: 12rpx;
				font-weight: bold;

				image {
					width: 36rpx;
					margin-right: 14rpx;
				}
			}
		}
	}
</style>